---
layout: default
title: Dashboard
---

<div class="row">
  <div class="col-xs-12">
    <table class="table  table-hover">
      <thead>
        <tr>
          <th><input type="checkbox" /></th>
          <th>用户</th>
          <th>地区</th>
          <th>国籍</th>
          <th>上次登陆时间</th>
          <th>留言</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><input type="checkbox" /></td>
          <td><img class="img-circle" src="https://s3.amazonaws.com/uifaces/faces/twitter/sauro/128.jpg">Sylvain Le Gac</td>
          <td>Cambridge, MA</td>
          <td>England</td>
          <td>2016-03-01</td>
          <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</td>
        </tr>
        <tr>
          <td><input type="checkbox" /></td>
          <td><img class="img-circle" src="https://s3.amazonaws.com/uifaces/faces/twitter/jsa/128.jpg">Peter. S</td>
          <td>Atlanta, GA</td>
          <td>USA.</td>
          <td>今天</td>
          <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</td>
        </tr>
        <tr>
          <td><input type="checkbox" /></td>
          <td><img class="img-circle" src="https://s3.amazonaws.com/uifaces/faces/twitter/ladylexy/128.jpg">Hanna Yoshinitsu</td>
          <td>San Francisco, CA</td>
          <td>USA.</td>
          <td>2016-0305</td>
          <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

<!-- Panel -->
<div class="row">
  <div class="col-xs-4">
    <div class="panel ">
      <div class="panel-title">
        <h5>Message</h5>
        <div class="panel-tools">
          <a href="#"><i class="fa fa-chevron-up"></i></a>
          <a href="#"><i class="fa fa-times"></i></a>
        </div>
      </div>
      <div class="panel-heading">
        <h3><i class="fa fa-envelope-o"></i> New Messages</h3>
        <small>You have 22 new messages and 16 waiting in draft folder.</small>
      </div>
      <div class="panel-body">
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum</p>
        <p>All the Lorem Ipsum generators on the Internet tend to repeat</p>
      </div>
    </div>
  </div>
  <div class="col-xs-4">
    <div class="panel ">
      <div class="panel-title">
        <h5>Message</h5>
        <div class="panel-tools">
          <a href="#"><i class="fa fa-chevron-up"></i></a>
          <a href="#"><i class="fa fa-times"></i></a>
        </div>
      </div>
      <div class="panel-body">
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum</p>
        <p>All the Lorem Ipsum generators on the Internet tend to repeat</p>
      </div>
    </div>
  </div>
  <div class="col-xs-4">
    <div class="panel ">
      <div class="panel-title">
        <h5>Message</h5>
        <div class="panel-tools">
          <a href="#"><i class="fa fa-chevron-up"></i></a>
          <a href="#"><i class="fa fa-times"></i></a>
        </div>
      </div>
      <div class="panel-body">
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum</p>
        <p>All the Lorem Ipsum generators on the Internet tend to repeat</p>
      </div>
    </div>
  </div>
</div>

<!-- Form -->
<div class="row row-full">
  <div class="col-xs-6">
    <div class="block-heading">
      <h2>横排表单</h2>
      <div class="heading-tool">
        <a href="modal.html" class="label label-success" data-toggle="modal" data-target="#myModal">新建</a>
      </div>
    </div>
    <form class="form-horizontal">
      <div class="form-group">
        <label for="exampleInputEmail1" class="control-label col-xs-2">邮箱</label>
        <div class="col-xs-9">
          <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
        </div>
      </div>
      <div class="form-group">
        <label for="inputPassword3" class="col-xs-2 control-label">密码</label>
        <div class="col-xs-9">
          <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
        </div>
      </div>
      <div class="col-xs-12 form-footer">
        <button type="submit" class="btn btn-success">确 定</button>
        <button type="reset" class="btn btn-default">取 消</button>
      </div>
    </form>
  </div>

  <div class="col-xs-6">
    <form>
      <div class="input-field-group">
        <input type="email" class="input-field" id="exampleInputEmail1-2" >
        <label for="exampleInputEmail1-2">邮箱</label>
      </div>
      <div class="input-field-group has-error">
        <input type="password" class="input-field" id="exampleInputPassword1-2" >
        <label for="exampleInputPassword1-2">密码</label>
      </div>
      <div class="checkbox">
        <label>
          <input type="checkbox"> Check me out
        </label>
      </div>
      <button type="submit" class="btn btn-success">Submit</button>
      <button type="reset" class="btn btn-danger">Reset</button>
    </form>
  </div>
</div>
